import React, { Component } from 'react';
import { Relax } from 'iflux2';
import { Map, OrderedSet } from 'immutable';
import { Row, Col, Pagination, Checkbox } from 'antd';

import noop from 'util/noop';

@Relax
export default class Pages extends Component {
    static defaultProps = {
        pagination: Map(),
        selectAll: false,
        indeterminate: false,
        pageSelectDisabled: false,
        queryOrderList: noop,
        setPagination: noop,
        selectAll4Page: noop
    }
    constructor(props){
        super(props);
        //页面滚动控制，翻页时调用
        this.pageWrapper = null;
    }
    componentDidMount() {
        if(window.document.getElementById("react-content")){
            this.pageWrapper = window.document.getElementById("react-content").getElementsByClassName("page-wrapper")[0];
        }
    }
    

    scrollTop(){
        if(this.pageWrapper){
            this.pageWrapper.scrollTop = 0;
        }else if(window.document.getElementById("react-content")){
            window.document.getElementById("react-content").getElementsByClassName("page-wrapper")[0].scrollTop = 0;
        }
    }
    render() {
        const { pagination, selectAll, indeterminate, selectAll4Page, pageSelectDisabled } = this.props;

        return (
            <Row className="pagination-retail">
                <Col span="7">
                    <div className="lh28">
                        <Checkbox checked={selectAll}
                            disabled={pageSelectDisabled}
                            indeterminate={indeterminate}
                            onChange={() => selectAll4Page(!selectAll)}>全选</Checkbox>
                    </div>
                </Col>
                <Col span="17">
                    <Pagination className="pull-right"
                        size="default"
                        current={pagination.get('pageNum')}
                        total={pagination.get('totalCount')}
                        pageSize={pagination.get('pageSize')}
                        showQuickJumper={true}
                        showSizeChanger={true}
                        pageSizeOptions={['10', '20', '30', '40']}
                        showTotal={(total, range) => `共${total}条`}
                        onChange={(page) => this.changePageNum(page)}
                        onShowSizeChange={(current, size) => this.changePageSize(current, size)} />
                </Col>
            </Row>
        )
    }


    selectAll(e) {
        this.setState({
            selectAll: e.target.checked
        })
    }


    /**
     * 下页操作
     * @param pageNum
     */
    changePageNum(pageNum) {
        this.props.setPagination({ pageNum: pageNum });
        this.query();
        this.scrollTop();
    }


    /**
     * 修改pageSize
     * @param current
     * @param pageSize
     */
    changePageSize(current, pageSize) {
        this.props.setPagination({ pageNum: 0, pageSize });
        this.query();
        this.scrollTop();
    }


    /**
     * 列表查询
     */
    query() {
       // const { condition } = this.props;
        this.props.queryOrderList();
    }
}